<template>
  <div class="main">
    <search @search="search" :batch-no="batchNo"></search>
    <div class="header">
      <van-tabs v-model="catLogIndex" @change="changeTab()">
        <van-tab v-for="(item,index) in catlog" v-bind:key="item.key">
          <div slot="title">
            <h5 v-show="nums[index]" class="nums">{{nums[index]}}</h5>
            {{item.name}}
          </div>
        </van-tab>
      </van-tabs>
      <ul class="condition">
        <li
          @click="conClick(item)"
          v-for="(item) in condition"
          :key="item.id"
          :style="{'flex':item.name.length}"
          class="fg"
        >
          {{item.name}}
          <i
            class="iconfont fg"
            :class="{'icon-icon-test21':item.sel,'icon-icon-test22':!item.sel}"
          ></i>
          <b class="refresh" @click.stop="clear1">
            <i class="iconfont icon-shuaxin"></i> 刷新
          </b>
        </li>
      </ul>
      <div class="content" v-show="conIndex>0">
        <div>
          <div v-show="conIndex==1">
            <div class="list-wrap" style="height:450px;">
              <div v-show="catLogIndex==0 || catLogIndex==1 || catLogIndex==5">
                <!-- <h5>年份</h5>
                    <ul class="list">
                      <li
                        v-for="item in s_nf"
                        @click="xj_nf_click(item)"
                        :key="item.key"
                        :class="{'sel':item.sel}"
                      >{{item.name}}</li>
                </ul>-->
                <h5 v-show="!catLogIndex==0 && !catLogIndex==5">产地</h5>
                <!-- <ul class="list" v-show="catLogIndex==0">
                  <li v-for="item in s_cd" @click="selCD(item)" :key="item.key" :class="{'sel':item.sel}">{{item.name}}</li>
                </ul>-->
                <ul class="list" v-show="catLogIndex==1">
                  <li
                    v-for="(item,index) in bt_cd"
                    @click="selCD(item)"
                    :key="item.key"
                    :class="{'sel':item.sel}"
                  >{{item.name}} <i v-show="index && btNums[index-1]">{{index>0?btNums[index-1]:''}}</i></li>
                </ul>
                <ul class="list" v-show="catLogIndex==4">
                  <li
                    v-for="item in p_cd"
                    @click="selPCD(item)"
                    :key="item.key"
                    :class="{'sel':item.sel}"
                  >{{item.name}}</li>
                </ul>
                <h5 v-show="!isPC">类型</h5>
                <ul v-show="!isPC" class="list">
                  <li
                    v-for="item in s_lx"
                    :key="item.key"
                    @click="item.sel = !item.sel"
                    :class="{'sel':item.sel}"
                  >{{item.name}}</li>
                </ul>
                <h5>交货地</h5>
                <ul v-show="catLogIndex==0 || catLogIndex==1 || catLogIndex==5" class="list">
                  <li
                    v-for="item in s_jhd_type.filter(n=>n.show==true)"
                    :key="item.key"
                    @click="xj_jhd_click(item)"
                    :class="{'sel':item.sel}"
                  >{{item.name}}</li>
                </ul>
                <ul v-show="xj_jhd==2 || catLogIndex==4" class="list">
                  <li
                    v-for="item in s_jhd2.filter(n=>n.name!='不限')"
                    @click="item.sel = !item.sel"
                    :key="item.key"
                    :class="{'sel':item.sel}"
                  >{{item.name}}</li>
                </ul>
                <h5>
                  质量
                  <i @click="setZB0">[常用指标]</i>
                </h5>
                <ul class="quality">
                  <li>
                    <label>等级</label>
                    <select id="selDJ0">
                      <option v-for="item in z_dj" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                  <li>
                    <label>长度</label>
                    <select id="selCD0">
                      <option v-for="item in z_cd" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                  <li>
                    <label>强力</label>
                    <select id="selQL0">
                      <option v-for="item in z_ql" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                  <li>
                    <label style="width:2em;">马值</label>
                    <select id="selMZ10" class="sel_w50">
                      <option v-for="item in z_mz1" :key="item" :value="item">{{item}}</option>
                    </select>
                    <select id="selMZ20" class="sel_w50">
                      <option v-for="item in z_mz2" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                  <li>
                    <label>含杂</label>
                    <select id="selHZ0">
                      <option v-for="item in z_hz" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                  <li>
                    <label>整齐度</label>
                    <select id="selZQD0">
                      <option v-for="item in z_zqd" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                </ul>
              </div>
              <div v-show="catLogIndex==4 ">
                <!-- <h5>年份</h5>
                    <ul class="list">
                      <li
                        v-for="item in s_nf"
                        @click="xj_nf_click(item)"
                        :key="item.key"
                        :class="{'sel':item.sel}"
                      >{{item.name}}</li>
                </ul>-->
                <h5>产地</h5>
                <ul class="list">
                  <li
                    v-for="item in d_cd"
                    @click="selCD2(item)"
                    :key="item.key"
                    :class="{'sel':item.sel}"
                  >{{item.name}}</li>
                </ul>
                <!-- <h5>类型</h5>
                <ul class="list">
                  <li v-for="item in s_lx" :key="item.key" @click="item.sel = !item.sel" :class="{'sel':item.sel}">{{item.name}}</li>
                </ul>-->
                <div class="d_jhd">
                  <h5>交货地</h5>
                  <h5 @click="seldcdall" class="all" :class="djhdsel?'sel':''">不限</h5>
                </div>

                <!-- <ul class="list">
                  <li v-for="item in s_jhd_type.filter(n=>n.showDC==true)" :key="item.key" @click="xj_jhd_click(item)" :class="{'sel':item.sel}">{{item.name}}</li>
                </ul>-->
                <ul class="list">
                  <li
                    v-for="item in s_jhd2.filter(n=>n.name!='不限')"
                    @click="item.sel = !item.sel;djhdsel = false;"
                    :key="item.key"
                    :class="{'sel':item.sel}"
                  >{{item.name}}</li>
                </ul>
                <h5>
                  质量
                  <i @click="setZB3">[常用指标]</i>
                </h5>
                <ul class="quality">
                  <li>
                    <label>等级</label>
                    <select id="selDJ3">
                      <option v-for="item in z_dj" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                  <li>
                    <label>长度</label>
                    <select id="selCD3">
                      <option v-for="item in z_cd" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                  <li>
                    <label>强力</label>
                    <select id="selQL3">
                      <option v-for="item in z_ql" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                  <li>
                    <label style="width:2em;">马值</label>
                    <select id="selMZ13" class="sel_w50">
                      <option v-for="item in z_mz1" :key="item" :value="item">{{item}}</option>
                    </select>
                    <select id="selMZ23" class="sel_w50">
                      <option v-for="item in z_mz2" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                  <li>
                    <label>含杂</label>
                    <select id="selHZ3">
                      <option v-for="item in z_hz" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                  <li>
                    <label>整齐度</label>
                    <select id="selZQD3">
                      <option v-for="item in z_zqd" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                </ul>
              </div>
              <div v-show="catLogIndex==3">
                <h5>产地</h5>
                <ul class="list">
                  <li
                    v-for="item in j_cd"
                    @click="item.sel = !item.sel"
                    :key="item.key"
                    :class="{'sel':item.sel}"
                  >{{item.name}}</li>
                </ul>
                <h5>交货地</h5>
                <ul class="list">
                  <li
                    v-for="item in s_jhd2.filter(n=>n.name!='江西' && n.name!='山西' && n.name!='天津')"
                    @click="item.sel = !item.sel"
                    :key="item.key"
                    :class="{'sel':item.sel}"
                  >{{item.name}}</li>
                </ul>
                <h5>质量</h5>
                <ul class="quality">
                  <li>
                    <label>等级</label>
                    <select id="selDJ2">
                      <option v-for="item in j_z_dj" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                  <li>
                    <label>长度</label>
                    <select id="selCD2">
                      <option v-for="item in j_z_cd" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                  <li>
                    <label>强力</label>
                    <select id="selQL2">
                      <option v-for="item in j_z_ql" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                  <li>
                    <label>马值</label>
                    <select id="selMZ2">
                      <option v-for="item in j_z_mz" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                </ul>
              </div>
              <div v-show="catLogIndex==2">
                <h5>产地</h5>
                <ul class="list">
                  <li
                    v-for="item in j_cd"
                    @click="item.sel = !item.sel"
                    :key="item.key"
                    :class="{'sel':item.sel}"
                  >{{item.name}}</li>
                </ul>
                <h5>交货地</h5>
                <ul class="list">
                  <li
                    v-for="item in j_s_jhd"
                    @click="j_s_jhd_Click(item)"
                    :key="item.key"
                    class="li2"
                    :class="{'sel':item.sel}"
                  >{{item.name}}</li>
                </ul>
                <h5>质量</h5>
                <ul class="quality">
                  <li>
                    <label>等级</label>
                    <select id="selDJ1">
                      <option v-for="item in j_z_dj" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                  <li>
                    <label>长度</label>
                    <select id="selCD1">
                      <option v-for="item in j_z_cd" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                  <li>
                    <label>强力</label>
                    <select id="selQL1">
                      <option v-for="item in j_z_ql" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                  <li>
                    <label>马值</label>
                    <select id="selMZ1">
                      <option v-for="item in j_z_mz" :key="item" :value="item">{{item}}</option>
                    </select>
                  </li>
                </ul>
              </div>
            </div>
            <div class="btns">
              <!-- <div class="left" style="background:#999;" @click="clear1">返回</div> -->
              <div class="right" @click="done1">收藏到定制</div>
              <!-- <div class="right" style="background: #f89393;" @click="dingzhi">添加到定制</div> -->
            </div>
          </div>
          <div v-show="conIndex==4">
            <div class="list-wrap">
              <h5></h5>
              <ul class="list">
                <li
                  v-for="item in s_jyms"
                  @click="item.sel = !item.sel"
                  :key="item.key"
                  :class="{'sel':item.sel}"
                >{{item.name}}</li>
              </ul>
            </div>
            <div class="btns">
              <div class="left" @click="clear1">返回</div>
              <div class="right" @click="done1">完成</div>
            </div>
          </div>
          <div v-show="conIndex==5">
            <div class="list-wrap">
              <h5>供货商</h5>
              <ul class="list ghs">
                <li v-for="item in s_ghs" @click="getGHS(item)" :key="item">{{item}}</li>
              </ul>
              <!-- <ul class="order">
                                                              <li v-for="item in s_px" @click="selOrder(item)" :key="item.key" :class="{'sel':item.sel}">{{item.name}}</li>
              </ul>-->
              <ul class="entList">
                <li
                  v-for="(item) in EntList"
                  :class="{'sel':item.sel}"
                  :key="item.ID"
                  @click="selEnt(item)"
                >{{item.EntName}}</li>
              </ul>
            </div>
            <div class="btns">
              <div class="left" @click="clear1">返回</div>
              <div class="right" @click="done1">完成</div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="mask" v-show="conIndex>0" @click="hideCon"></div>
    <div class="batchlist" ref="batchlist" id="batchlist1">
      <van-list v-model="loading" :finished="finished" @load="infinite2">
        <batch v-for="(item,index) in batchList" @search="search" :batch="item" :key="index"></batch>
      </van-list>
      <div v-show="showNoData" class="nodata">
        <div>对不起，未找到您需要的数据</div>
      </div>
    </div>
    <share :batch-no="batchNo" :show="true" :icon="iconUrl" :cat-log-index="catLogIndex"></share>
    <kefu></kefu>
    <query></query>
  </div>
</template>

<script>
import batch from "@/components/batch";
import search from "@/components/search";
import api from "@/api/api";
import share from "@/components/share";
import kefu from "@/components/kefu";
import query from "@/components/query";
import { Toast } from "vant";
export default {
  inject: ["login"],
  data() {
    return {
      djhdsel: true,
      clientHeight: "",
      isLoading: false,
      showNoData: false,
      SellStorage: "",
      JHDList: [],
      StoList: [],
      pageIndex: 1,
      pageSize: 20,
      count: 0,
      batchList: [],
      loading: false,
      finished: false,
      EntList: [],
      iconUrl: "",
      EntID: "",
      timer: null,
      nums: [0, 0, 0, 0, 0],
      isFirstLoad: true,
      s_nf: [
        {
          name: "新棉",
          key: "1",
          sel: true
        },
        {
          name: "拍储棉",
          key: "2",
          sel: false
        }
      ],
      bt_cd: this.$store.state.bt_cd,
      d_cd: this.$store.state.d_cd,
      j_cd: this.$store.state.j_cd,
      s_cd: [
        { name: "不限", key: "60", sel: false },
        { name: "地方", key: "6001", sel: false },
        { name: "兵团", key: "6002", sel: false }
      ],
      s_lx: [
        { name: "手摘棉", key: "1", sel: false },
        { name: "机采棉", key: "2", sel: false },
        { name: "皮辊棉", key: "3", sel: false },
        { name: "长绒棉", key: "4", sel: false }
      ],
      s_ysj: [
        { name: "11", key: "1", sel: false },
        { name: "21", key: "2", sel: false },
        { name: "31", key: "3", sel: false },
        { name: "41", key: "4", sel: false },
        { name: "51", key: "5", sel: false },
        { name: "12", key: "6", sel: false },
        { name: "22", key: "7", sel: false },
        { name: "32", key: "8", sel: false },
        { name: "13", key: "9", sel: false },
        { name: "23", key: "10", sel: false },
        { name: "33", key: "11", sel: false },
        { name: "14", key: "12", sel: false },
        { name: "24", key: "13", sel: false }
      ],
      s_jhd_type: [
        {
          name: "新疆仓库",
          key: "1",
          sel: false,
          show: true,
          showDC: false
        },
        {
          name: "内地仓库",
          key: "2",
          sel: false,
          show: true,
          showDC: true
        }
      ],
      j_s_jhd: [
        { name: "不限", key: "0", sel: false },
        { name: "保税仓库交货", key: "1", sel: false },
        { name: "海运在途", key: "2", sel: false },
        { name: "原产地装运", key: "3", sel: false }
      ],
      s_jhd1: [
        { name: "南疆", key: "1", sel: false },
        { name: "北疆", key: "2", sel: false },
        { name: "东疆", key: "3", sel: false }
      ],
      s_jhd2: this.$store.state.s_jhd2,
      isPC: false,
      xj_jhd: 0,
      z_dj: [
        "不限",
        "11",
        "21",
        "31+",
        "41+",
        "51+",
        "12+",
        "22+",
        "32+",
        "13+",
        "23+",
        "33+",
        "14+",
        "24+"
      ],
      z_cd: [
        "不限",
        "25+",
        "25.5+",
        "26+",
        "26.5+",
        "27+",
        "27.5+",
        "27.8+",
        "28+",
        "28.5+",
        "28.8+",
        "29+",
        "29.5+",
        "30+"
      ],
      z_ql: [
        "不限",
        "25",
        "25.5",
        "26",
        "26.5",
        "27",
        "27.5",
        "28",
        "28.5",
        "29",
        "29.5",
        "30"
      ],
      z_mz1: this.$store.state.z_mz1,
      z_mz2: this.$store.state.z_mz2,
      z_hz: [
        "不限",
        "0.6-",
        "1.0-",
        "1.2-",
        "1.5-",
        "2.0-",
        "2.5-",
        "3.0-",
        "3.0+"
      ],
      z_zqd: ["不限", "79+", "80+", "81+", "82+", "82.5+", "83+"],
      j_z_dj: ["不限", "GM", "SM", "M+", "SLM+", "LM+"],
      j_z_cd: [
        "不限",
        "1",
        "1-1/32+",
        "1-1/16+",
        "1-3/32+",
        "1-1/8+",
        "1-5/32+"
      ],
      j_z_ql: ["不限", "25+", "26+", "27+", "28+", "29+"],
      j_z_mz: ["不限", "G1", "G2", "G3", "G4", "G5", "G6", "G7"],
      catlog: [
        { name: "新疆棉", key: "1" },
        { name: "兵团棉", key: "6" },
        { name: "进口棉$", key: "2" },
        { name: "进口棉¥", key: "3" },
        { name: "地产棉", key: "4" },
        { name: "拍储棉", key: "5" }
      ],
      p_cd: this.$store.state.p_cd,
      catLogIndex: 0,
      conIndex: 0,
      condition: [
        {
          name: "新疆棉高级定制",
          id: 1,
          sel: false
        }
      ],
      s_lx: [
        { name: "手摘棉", key: "1", sel: false },
        { name: "机采棉", key: "2", sel: false },
        { name: "皮辊棉", key: "3", sel: false },
        { name: "长绒棉", key: "4", sel: false }
      ],
      s_ysj: [
        { name: "11", key: "1", sel: false },
        { name: "21", key: "2", sel: false },
        { name: "31", key: "3", sel: false },
        { name: "41", key: "4", sel: false },
        { name: "51", key: "5", sel: false },
        { name: "12", key: "6", sel: false },
        { name: "22", key: "7", sel: false },
        { name: "32", key: "8", sel: false },
        { name: "13", key: "9", sel: false },
        { name: "23", key: "10", sel: false },
        { name: "33", key: "11", sel: false },
        { name: "14", key: "12", sel: false },
        { name: "24", key: "13", sel: false }
      ],
      s_jhd1: [
        {
          name: "新疆",
          key: "66",
          sel: false
        }
      ],
      s_jkjhd2: [
        { name: "保税仓库交货", key: "1", sel: false },
        { name: "海运在途", key: "2", sel: false },
        { name: "原产地装运", key: "3", sel: false }
      ],
      s_jhd3: [
        { name: "湖南", key: "1", sel: false },
        { name: "江西", key: "2", sel: false },
        { name: "四川", key: "3", sel: false },
        { name: "山东", key: "4", sel: false },
        { name: "河南", key: "5", sel: false },
        { name: "河北", key: "6", sel: false },
        { name: "山西", key: "7", sel: false },
        { name: "天津", key: "8", sel: false }
      ],
      s_jkjhd: this.$store.state.j_cd,
      btNums:[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0],
      s_jyms: [
        {
          name: "现价成交",
          key: "1",
          sel: false
        },
        {
          name: "期货交易",
          key: "2",
          sel: false
        }
      ],
      s_ghs: [
        "A",
        "B",
        "C",
        "D",
        "E",
        "F",
        "G",
        "H",
        "I",
        "J",
        "K",
        "L",
        "M",
        "N",
        "O",
        "P",
        "Q",
        "R",
        "S",
        "T",
        "U",
        "V",
        "W",
        "X",
        "Y",
        "Z"
      ],
      s_px: [
        { name: "特价", key: "1", sel: false },
        { name: "已售", key: "2", sel: false },
        { name: "预售", key: "3", sel: false },
        { name: "挂单", key: "4", sel: false },
        { name: "保留", key: "5", sel: false }
      ],
      batchNo: "",
      catLogIndex2: 0
    };
  },
  components: {
    batch,
    search,
    share,
    kefu,
    query
  },
  computed: {
    isJK() {
      return this.catLogIndex == 2 || this.catLogIndex == 3;
    }
  },
  watch: {
    // 如果 `clientHeight` 发生改变，这个函数就会运行
    clientHeight: function() {
      this.changeFixed(this.clientHeight);
    }
  },
  mounted() {
    // 获取浏览器可视区域高度
    this.clientHeight = `${document.documentElement.clientHeight}`; //document.body.clientWidth;
    //console.log(self.clientHeight);
    window.onresize = function temp() {
      this.clientHeight = `${document.documentElement.clientHeight}`;
    };
  },
  methods: {
    seldcdall() {
      if (this.djhdsel) {
        this.djhdsel = false;
        return;
      }
      this.djhdsel = !this.djhdsel;
      this.s_jhd2.forEach(n => {
        n.sel = false;
      });
    },
    setZB0() {
      $("#selDJ0").val("31+");
      $("#selCD0").val("28+");
      $("#selQL0").val("27");
      $("#selMZ10").val("4.2");
      $("#selHZ0").val("1.5-");
    },
    setZB2() {
      $("#selDJ2").val("SM");
      $("#selCD2").val("1-1/8+");
      $("#selQL2").val("28+");
      $("#selMZ2").val("G5");
    },
    setZB1() {
      $("#selDJ1").val("SM");
      $("#selCD1").val("1-1/8+");
      $("#selQL1").val("28+");
      $("#selMZ1").val("G5");
    },
    setZB3() {
      $("#selDJ3").val("31+");
      $("#selCD3").val("28+");
      $("#selQL3").val("27");
      $("#selMZ13").val("4.2");
      $("#selHZ3").val("1.5-");
    },
    save() {
      if (!this.$store.state.userInfo || !this.$store.state.userInfo.OpenID) {
        Toast.fail("请先登录！");
        return;
      }
      if (
        this.catLogIndex == 5 ||
        this.catLogIndex == 1 ||
        this.catLogIndex == 0
      ) {
        this.catLogIndex2 = 0;
      } else {
        this.catLogIndex2 = this.catLogIndex - 1;
      }
      var nf = this.s_nf.find(n => n.sel);
      var cd = this.s_cd.find(n => n.sel);
      var cdd = this.d_cd.find(n => n.sel);
      var cdj = this.j_cd.find(n => n.sel);
      var lx = "";
      this.s_lx.forEach(n => {
        if (n.sel) {
          lx += n.name + ";";
        }
      });
      var jhd = this.s_jhd_type.find(n => n.sel);
      var jhd2 = this.s_jhd2.find(n => n.sel);
      var MadeIn = "";
      var MadeInName = "";
      var jhdName = "";
      var data = {};
      if (this.catLogIndex2 == 0) {
        this.bt_cd.forEach(n => {
          if (n.sel) {
            MadeIn += n.key + ";";
            MadeInName += n.name + ";";
          }
        });
        this.s_cd.forEach(n => {
          if (n.sel) {
            if (n.list) {
              let s_cd_subItem = "";
              let s_cd_subItemName = "";
              n.list.forEach(k => {
                if (k.sel) {
                  s_cd_subItem += k.key + ";";
                  s_cd_subItemName += k.name + ";";
                }
              });
              if (!s_cd_subItem) {
                s_cd_subItem += n.key + ";";
                s_cd_subItemName += n.name + ";";
              }
              MadeIn += s_cd_subItem;
              MadeInName += s_cd_subItemName;
            } else {
              MadeIn += n.key + ";";
              MadeInName += n.name + ";";
            }
          }
        });
        {
          if (jhd != null && jhd.key == "1") {
            jhdName = jhd.name + ";";
          } else {
            this.s_jhd_type.forEach(n => {
              if (n.sel) {
                jhdName += n.name + ";";
              }
            });
            this.s_jhd2.forEach(n => {
              if (n.sel) {
                jhdName += n.name + ";";
              }
            });
          }
        }
        data = {
          DelFlag: 0,
          UserID: this.$store.state.userInfo.ID,
          UserName: this.$store.state.userInfo.XM,
          NeedType: this.catLogIndex2,
          NeedYear: nf == null ? "" : nf.key,
          CDCode: MadeIn,
          CDName: MadeInName,
          CType: lx,
          JHD: jhdName,
          JHDType: jhd == null ? "" : jhd.key,
          DengJi: $("#selDJ0").val(),
          ChangDu: $("#selCD0").val(),
          QiangLi: $("#selQL0").val(),
          MaZhi1: $("#selMZ10").val(),
          MaZhi2: $("#selMZ20").val(),
          HanZa: $("#selHZ0").val(),
          ZhengQiDu: $("#selZQD0").val()
        };
      } else if (this.catLogIndex2 == 3) {
        if (jhd != null && jhd.key == "1") {
          jhdName = jhd.name + ";";
        } else {
          this.s_jhd2.forEach(n => {
            if (n.sel) {
              jhdName += n.name + ";";
            }
          });
        }
        this.d_cd.forEach(n => {
          if (n.sel) {
            MadeInName += n.name + ";";
            MadeIn += n.key + ";";
          }
        });
        data = {
          DelFlag: 0,
          UserID: this.$store.state.userInfo.ID,
          UserName: this.$store.state.userInfo.XM,
          NeedType: this.catLogIndex2,
          NeedYear: 1,
          CDCode: MadeIn,
          CDName: MadeInName,
          CType: lx,
          JHDType: jhd == null ? "" : jhd.key,
          JHD: jhdName,
          DengJi: $("#selDJ3").val(),
          ChangDu: $("#selCD3").val(),
          QiangLi: $("#selQL3").val(),
          MaZhi1: $("#selMZ13").val(),
          MaZhi2: $("#selMZ23").val(),
          HanZa: $("#selHZ3").val(),
          ZhengQiDu: $("#selZQD3").val()
        };
      } else if (this.catLogIndex2 == 2) {
        this.j_cd.forEach(n => {
          if (n.sel) {
            MadeInName += n.name + ";";
            MadeIn += n.key + ";";
          }
        });
        this.s_jhd2.forEach(n => {
          if (n.sel) {
            jhdName += n.name + ";";
          }
        });
        data = {
          DelFlag: 0,
          UserID: this.$store.state.userInfo.ID,
          UserName: this.$store.state.userInfo.XM,
          NeedType: this.catLogIndex2,
          CDCode: MadeIn,
          CDName: MadeInName,
          JHD: jhdName,
          DengJi: $("#selDJ2").val(),
          ChangDu: $("#selCD2").val(),
          QiangLi: $("#selQL2").val(),
          MaZhi1: $("#selMZ2").val()
        };
      } else if (this.catLogIndex2 == 1) {
        this.j_cd.forEach(n => {
          if (n.sel) {
            MadeInName += n.name + ";";
            MadeIn += n.key + ";";
          }
        });
        this.j_s_jhd.forEach(n => {
          if (n.sel) {
            jhdName += n.name + ";";
          }
        });
        data = {
          DelFlag: 0,
          UserID: this.$store.state.userInfo.ID,
          UserName: this.$store.state.userInfo.XM,
          NeedType: this.catLogIndex,
          CDCode: MadeIn,
          CDName: MadeInName,
          JHD: jhdName,
          DengJi: $("#selDJ1").val(),
          ChangDu: $("#selCD1").val(),
          QiangLi: $("#selQL1").val(),
          MaZhi1: $("#selMZ1").val()
        };
      }
      data.ID = this.$route.query.id;
      data.EntName = this.$store.state.userInfo.EntName;

      if (this.catLogIndex == 1) {
        data.NeedType = 5;
      }
      api.AddDemand(data).then(res => {
        if (res.success) {
        } else {
          //Toast.fail("提交失败");
        }
      });
    },
    dingzhi() {
      this.save();
    },
    selCD(item) {
      item.sel = !item.sel;
      if (item.key == "60") {
        this.s_cd.forEach(n => {
          if (n.key != "60") {
            n.sel = false;
          }
        });
        this.bt_cd.forEach(n => {
          if (n.key != "60") {
            n.sel = false;
          }
        });
      } else {
        this.s_cd[0].sel = false;
        this.bt_cd[0].sel = false;
      }
    },
    selPCD(item) {
      item.sel = !item.sel;
      if (item.key == "60") {
        this.p_cd.forEach(n => {
          if (n.key != "60") {
            n.sel = false;
          }
        });
      } else {
        this.p_cd[0].sel = false;
      }
    },
    xj_jhd_click(item) {
      var d = this.s_jhd_type.find(n => n.sel);
      if (d != null) {
        d.sel = !d.sel;
      }
      item.sel = !item.sel;
      this.xj_jhd = item.key;
    },
    xj_nf_click(item) {
      var d = this.s_nf.find(n => n.sel);
      if (d != null && d.key != item.key) {
        d.sel = false;
      }
      item.sel = !item.sel;     
      if (item.key == "1") {
        this.isPC = true;
        this.s_jhd_type[0].show = true;
      } else {
        this.isPC = false;
        this.s_jhd_type[0].show = true;
      }
    },
    j_s_jhd_Click(item) {
      var d = this.j_s_jhd.find(n => n.sel);
      if (d != null && d.key != item.key) {
        d.sel = false;
      }
      item.sel = !item.sel;
    },
    search(batchNo) {
      if (batchNo == "dingzhi") {
        this.conIndex > 0 ? (this.conIndex = 0) : (this.conIndex = 1);
        return;
      }
      this.pageIndex = 1;
      this.batchNo = batchNo;
      var that = this;
      this.doGetList(function() {
        console.log(that.nums);
        var index = that.nums.findIndex(n => n > 0);
        if (index >= 0) {
          that.catLogIndex = index;
        }
      });

      //this.share();
    },
    changeTab() {
      this.pageIndex = 1;
      this.clearAllParas();
      this.doGetList();
    },
    selJHD(item) {
      item.sel = !item.sel;
      if (item.sel) {
        this.JHDList.push(item.name);
      } else {
        this.JHDList.splice(this.JHDList.findIndex(n => n == item.name), 1);
      }
      api
        .getStorage({
          PName: this.JHDList.join(",")
        })
        .then(res => {
          res.forEach(n => {
            n.sel = false;
          });
          this.StoList = res;
        });
    },
    selCD2(item) {
      item.sel = !item.sel;
      if (item.key == "01") {
        this.d_cd.forEach(n => {
          if (n.key != "01") {
            n.sel = false;
          }
        });
      } else {
        this.d_cd[0].sel = false;
      }
    },
    selEnt(item) {
      var d = this.EntList.find(n => n.sel);
      if (d) {
        d.sel = false;
      }
      this.EntID = item.ID;
      item.sel = true;
    },
    selSto(item) {
      var d = this.StoList.find(n => n.sel);
      if (d) {
        d.sel = false;
      }
      this.SellStorage = item.SellStorage;
      item.sel = true;
    },
    getEntList(PYS) {
      api
        .getEntListByPYS({
          PYS: PYS
        })
        .then(res => {
          res.forEach(n => {
            n.sel = false;
          });
          this.EntList = res;
        });
    },
    getPara() {
      var CZFS = this.s_lx.filter(n => n.sel == true);
      let cType = "";
      CZFS.forEach(n => {
        cType += "'" + n.name + "',";
      });
      var cd = "";
      var ql = "";
      var dcd = "";
      var MZ = "",
        MZ_J = "";
      var jcd = "";
      let nColorgd = "",
        nColorgd_J = "";
      var cIndex =
        this.catLogIndex == 5 || this.catLogIndex == 1 || this.catLogIndex == 0
          ? 0
          : this.catLogIndex - 1;
      let SellProvince = "",
        JHFS = "";
      var jhd = this.s_jhd_type.find(n => n.sel);
      ql = $("#selQL" + cIndex).val();
      if (this.isJK) {
        nColorgd_J = $("#selDJ" + cIndex).val();
        jcd = $("#selCD" + cIndex).val();
        MZ_J += $("#selMZ" + cIndex).val();
        this.j_cd.forEach(n => {
          if (n.sel) {
            cd += "'" + n.name + "',";
          }
        });
        this.j_s_jhd.forEach(n => {
          if (n.sel) {
            JHFS = n.name;
          }
        });
      } else {
        nColorgd = $(
          "#selDJ" +
            (this.catLogIndex == 5 ||
            this.catLogIndex == 1 ||
            this.catLogIndex == 0
              ? 0
              : this.catLogIndex - 1)
        ).val();
        MZ = $("#selMZ1" + cIndex).val() + ";" + $("#selMZ2" + cIndex).val();
        if (this.catLogIndex == 0 || this.catLogIndex == 1) {
          this.s_cd.forEach(n => {
            if (n.sel) {
              cd += "'" + n.name + "',";
            }
          });
          this.bt_cd.forEach(n => {
            if (n.sel) {
              cd += "'" + n.name + "',";
            }
          });
        } else {
          this.d_cd.forEach(n => {
            if (n.sel) {
              cd += "'" + n.name + "',";
            }
          });
          this.p_cd.forEach(n => {
            if (n.sel) {
              cd += "'" + n.name + "',";
            }
          });
        }
      }

      this.s_jhd_type.forEach(n => {
        if (n.sel) {
          SellProvince += "'" + n.name + "',";
        }
      });
      this.s_jhd3.forEach(n => {
        if (n.sel) {
          SellProvince += "'" + n.name + "',";
        }
      });
      if (jhd && jhd.key == "1") {
        SellProvince = "'" + jhd.name + "';";
      } else {
        this.s_jhd2.forEach(n => {
          if (n.sel) {
            SellProvince += "'" + n.name + "';";
          }
        });
      }
      let SellType = "";
      this.s_jyms.forEach(n => {
        if (n.sel) {
          SellType += "'" + n.key + "',";
        }
      });
      let Status = 0;
      var s = this.s_px.find(n => n.sel == true);
      if (s != null) {
        Status = s.key;
      }

      var para = {
        BatchNo: this.batchNo,
        showEntID: showEntID,
        pageIndex: this.pageIndex,
        pageSize: this.pageSize,
        CZFS: cType,
        madeIn: cd,
        nColorgd: nColorgd,
        nColorgd_J: nColorgd_J,
        nAvglength: $("#selCD" + cIndex).val(),
        nAvglength_J: jcd,
        nAvgintension: ql,
        nAvgmike: MZ,
        nAvgmike_J: MZ_J,
        nTrash: $("#selHZ" + cIndex).val(),
        nAvgrd: $("#selZQD" + cIndex).val(),
        SellProvince: SellProvince,
        JHFS: JHFS,
        SellType: SellType,
        EntID: this.EntID,
        Status: Status,
        BatchType: this.catlog[this.catLogIndex].key,
        OpenId: this.$store.state.userInfo.OpenID,
        SellStorage: this.SellStorage
      };
      return para;
    },
    doGetList(doneFunc) {
      var cat = this.catlog[this.catLogIndex];
      this.condition = [
        {
          name: cat.name + "高级定制",
          id: 1,
          sel: false
        }
      ];
      if (
        this.catLogIndex == 0 ||
        this.catLogIndex == 5 ||
        this.catLogIndex == 1
      ) {
        this.xj_nf_click(this.s_nf.find(n => n.key == 1));
      } else if (this.catLogIndex == 5) {
        this.xj_nf_click(this.s_nf.find(n => n.key == 2));
      }

      this.showNoData = false;
      this.batchList = [];
      api.getBatchList(this.getPara()).then(res => {
        this.batchList = res.data;
        this.nums = res.nums;
        this.count = res.count;
        this.isLoading = false;
        if (this.count) {
          Toast({
            message:
              "已加载 " +
              (this.count < this.pageSize ? this.count : this.pageIndex * 20) +
              "/" +
              this.count +
              " 条记录",
            position: "bottom",
            duration: 1500
          });
          this.pageIndex++;
        } else {
          Toast({
            message: "未查询到记录",
            position: "bottom",
            duration: 1500
          });
          this.showNoData = true;
        }
        this.initShare(res);
        if (typeof doneFunc == "function") {
          doneFunc();
        }
        // if(this.batchList.length==1 && !isNaN(this.batchNo))
        // {
        //     this.catLogIndex = this.batchList[0].BatchType-1;
        // }
      });
    },
    getValue(s) {
      if (s) {
        return s;
      } else {
        return "";
      }
    },
    initShare(res) {
      setTimeout(() => {
        if (res.logo) {
          var ShowEntID = this.$route.query.ShowEntID
            ? this.$route.query.ShowEntID
            : "";
          var EntName = this.$route.query.EntName
            ? this.$route.query.EntName
            : "";
          var url =
            "https://www.icottontrade.com/cot/redirect?catLogIndex=" +
            this.$route.query.catLogIndex +
            "&keyWords=" +
            encodeURI(this.batchNo) +
            "&ShowEntID=" +
            ShowEntID +
            "&EntName=" +
            encodeURI(EntName);

          if (!res.logo) {
            this.iconUrl = "https://www.icottontrade.com/cot/upload/logo.jpg";
          } else {
            this.iconUrl =
              "https://www.icottontrade.com/cot/Upload/Logo/" +
              encodeURI(res.logo);
          }
          var that = this;
          var desc = "";
          if (!EntName) {
            if(this.$store.state.userInfo.EntName)
            {
              desc =
              this.$store.state.userInfo.EntName +
              " " +
              this.getValue(this.$store.state.userInfo.XM) +
              " " +
              this.getValue(this.$store.state.userInfo.phoneno);
            }else
            {
              desc = this.$store.state.userInfo.NickName+'为您推荐';
            }
            
          } else {
            desc =
              EntName +
              " " +
              this.getValue(this.$store.state.userInfo.XM) +
              " " +
              this.getValue(this.$store.state.userInfo.phoneno);
          }
          //desc = encodeURI(desc)
          console.log(desc);
          wx.onMenuShareAppMessage({
            title: desc,
            desc: "聚棉网为您推荐以下资源",
            link: url, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
            imgUrl: that.iconUrl, // 自定义图标
            type: "link", // 分享类型,music、video或link，不填默认为link
            dataUrl: "", // 如果type是music或video，则要提供数据链接，默认为空
            success: function() {
              // 用户确认分享后执行的回调函数
              Toast({
                message: "分享成功",
                duration: 1500
              });
            },
            cancel: function() {
              // 用户取消分享后执行的回调函数
            }
          });
          //alert('home:'+desc)
          wx.onMenuShareTimeline({
            title: desc,
            link: url,
            imgUrl: that.iconUrl // 自定义图标
          });
        } else {
          this.iconUrl = "";
        }
      }, 500);
    },
    refresh() {
      if (this.$store.state.userInfo.isBlack) {
        return;
      }
      this.$refs.my_scroller.finishPullToRefresh();
      Toast({
        message: "刷新成功",
        position: "bottom",
        duration: 1500
      });
      this.doGetList();
    },
    infinite2() {
      var num = 0;
      // if((this.$store.state.userInfo && this.$store.state.userInfo.OpenID))
      // {
      //     this.infinite();
      //     return;
      // }
      this.infinite();
      // this.timer= setInterval(() => {
      //     if((this.$store.state.userInfo && this.$store.state.userInfo.OpenID) )
      //     {
      //         this.infinite();
      //         console.log('yes' + num)
      //         clearInterval(this.timer);
      //     }else{
      //         //console.log('no')
      //         num++;
      //     }
      //     if(num>39)
      //     {
      //         console.log('need login')
      //         clearInterval(this.timer);
      //         this.loading = false;
      //         this.finished = true;
      //         Toast.fail('请先登录！');
      //     }
      // }, 200);
    },
    infinite() {
      console.log("getlist");
      let self = this; //this指向问题
      api.getBatchList(this.getPara()).then(res => {
        res.data.forEach(d => {
          this.batchList.push(d);
        });
        this.initShare(res);
        this.count = res.count;
        this.nums = res.nums;
        Toast({
          message:
            "已加载 " +
            (this.count < this.pageSize ? this.count : this.pageIndex * 20) +
            "/" +
            this.count +
            " 条记录",
          position: "bottom",
          duration: 1500
        });
        this.loading = false;
        if (res.data.length) {
          this.pageIndex++;
        } else {
          this.finished = true;
          Toast({
            message: "已加载全部记录",
            position: "bottom",
            duration: 1500
          });
          this.loading = false;
          return;
        }
      });
    },
    changeFixed(clientHeight) {
      //动态修改样式
      this.$refs.batchlist.style.height = clientHeight - 160 + "px";
    },
    selOrder(item) {
      var d = this.s_px.find(n => n.sel == true);
      if (d != null) {
        d.sel = false;
      }
      item.sel = true;
    },
    getGHS(key) {
      this.getEntList(key);
    },
    done1() {
      this.pageIndex = 1;
      this.save();
      this.condition.forEach(n => {
        n.sel = false;
      });
      this.conIndex = 0;
      this.$store.commit("setDZNotice", 1);
      this.doGetList();
    },
    clearAllParas() {
      this.conIndex = 0;

      this.s_cd.forEach(n => {
        n.sel = false;
      });
      this.bt_cd.forEach(n => {
        n.sel = false;
      });
      this.p_cd.forEach(n => {
        n.sel = false;
      });
      this.s_lx.forEach(n => {
        n.sel = false;
      });
      this.s_jhd_type.forEach(n => {
        n.sel = false;
      });
      this.s_jhd2.forEach(n => {
        n.sel = false;
      });
      this.d_cd.forEach(n => {
        n.sel = false;
      });
      this.s_jhd_type.forEach(n => {
        n.sel = false;
      });
      this.s_jhd2.forEach(n => {
        n.sel = false;
      });
      this.j_cd.forEach(n => {
        n.sel = false;
      });
      this.s_jhd2.forEach(n => {
        n.sel = false;
      });

      this.j_s_jhd.forEach(n => {
        n.sel = false;
      });
      var arrIds = "selDJ2 selCD2 selQL2 selMZ2 selDJ0 selCD0 selQL0 selMZ10 selMZ20 selHZ0 selZQD0 selDJ3 selCD3  selQL3 selMZ13 selMZ23 selHZ3 selZQD3 selDJ1 selCD1 selQL1 selQL1 selMZ1".split(
        " "
      );
      arrIds.forEach(n => {
        $("#" + n).val("不限");
      });
    },
    clear1() {
      this.pageIndex = 1;
      this.clearAllParas();

      this.doGetList();
    },
    conClick(item) {
      var d = this.condition.find(n => n.sel == true);
      if (!item.sel && d != null) {
        d.sel = false;
      }
      item.sel = !item.sel;
      if (item.sel) {
        this.conIndex = item.id;
      } else {
        this.conIndex = 0;
      }
    },
    hideCon() {
      this.conIndex = 0;
    },
    // share() {
    //   var url =
    //     "https://www.icottontrade.com/cot/redirect?catLogIndex=" +
    //     this.$route.query.catLogIndex +
    //     "&keyWords=" +
    //     encodeURI(this.batchNo);
    //   wx.onMenuShareAppMessage({
    //     title: this.$store.state.userInfo.NickName + "为您推荐", // 分享标题
    //     desc: "聚棉网为您推荐以下资源",
    //     link: url, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
    //     imgUrl:
    //       "https://www.icottontrade.com/cot/Upload/Logo/" +
    //       this.$store.state.userInfo.EntLogoUrl, // 自定义图标
    //     type: "link", // 分享类型,music、video或link，不填默认为link
    //     dataUrl: "", // 如果type是music或video，则要提供数据链接，默认为空
    //     success: function() {
    //       // 用户确认分享后执行的回调函数
    //       Toast({
    //         message: "分享成功",
    //         duration: 1500
    //       });
    //     },
    //     cancel: function() {
    //       // 用户取消分享后执行的回调函数
    //     }
    //   });
    //   wx.onMenuShareTimeline({
    //     title: this.$store.state.userInfo.EntName,
    //     link: window.location.href,
    //     imgUrl: "http://www.icottontrade.com/cot/upload/logo.jpg" // 自定义图标
    //   });
    // }
    initCondition() {
      // $("#selDJ0").val("31+");
      // $("#selCD0").val("28+");
      // $("#selQL0").val("27");
      // $("#selMZ10").val("4.2");
      // $("#selHZ0").val("1.2-");
      // $("#selDJ3").val("31+");
      // $("#selCD3").val("28+");
      // $("#selQL3").val("27");
      // $("#selMZ13").val("4.2");
      // $("#selHZ3").val("1.2-");
    }
  },
  created() {
    if (this.$route.query.keyWords) {
      this.batchNo = this.$route.query.keyWords;
    }
    if (this.$route.query.EntName) {
      this.batchNo = this.$route.query.EntName;
    }
    if (this.$route.query.catLogIndex) {
      this.catLogIndex = parseInt(this.$route.query.catLogIndex);
      var cat = this.catlog[this.catLogIndex];
      this.condition = [
        {
          name: cat.name + "高级定制",
          id: 1,
          sel: false
        }
      ];
    }
    api.getBTNums().then(res=>{
      this.btNums = res;
    })
    setTimeout(() => {
      this.initCondition();
    }, 500);
  },
  beforeRouteEnter(to, from, next) {
    if (!sessionStorage.askPositon) {
      //当前页面刷新不需要切换位置
      sessionStorage.askPositon = "";
      next();
    } else {
      next(vm => {
        try {
          if (vm && vm.$refs.batchlist) {
            //通过vm实例访问this
            setTimeout(function() {
              $("#batchlist1").scrollTop(sessionStorage.askPositon);
            }, 0); //同步转异步操作
          }
        } catch (e) {
          alert(e);
        }
      });
    }
  },
  beforeRouteLeave(to, from, next) {
    //记录离开时的位置
    sessionStorage.askPositon =
      this.$refs.batchlist && this.$refs.batchlist.scrollTop;
    next();
  }
};
</script>

<style scoped lang='less'>
.main {
  .d_jhd {
    text-align: left;
    .all {
      border: 1px solid #2cb98e;
      border-color: #ccc;
      line-height: 1.5em;
      height: 1.5em;
      width: 4em;
      font-size: 12px;
      font-weight: normal;
      text-align: center !important;
    }
    .sel {
      border-color: #2cb98e;
      background: #2cb98e;
      color: #fff;
    }
    > h5 {
      display: inline-block;
    }
  }
  .batchlist {
    height: 480px;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
    .nodata {
      padding-top: 20px;
      line-height: 2em;
      color: #999;
    }
  }
  .condition {
    position: relative;
    .refresh {
      position: absolute;
      right: 1em;
      top: -1px;
      display: block;
      color: #999;
      font-size: 12px;
      i {
        position: relative;
        top: 2px;
      }
    }
  }
  .quality {
    margin-top: 10px;
    text-align: left;
    font-size: 12px;
    display: flex;
    flex-wrap: wrap;
    label {
      width: 3em;
      display: inline-block;
      text-align: left;
    }
    li {
      min-width: 10em;
      max-width: 12em;
      flex: 1;
      height: 2.5em;
    }
  }
  select {
    outline: 0;
    background: rgba(0, 0, 0, 0);
    width: 5em;
    height: 20px;
    font-size: 12px;
    text-align: center;
    border: 1px #ccc solid;
    border-radius: 5px;
    option {
      color: black;
      line-height: 15px;
      height: 15px;
    }
  }
  .sel_w50 {
    width: 4.5em;
  }
  .stoList {
    li {
      display: block;
      color: #333;
      text-align: left;
      line-height: 1.5em;
    }
    .sel {
      color: #2cb98e;
    }
    margin-bottom: 3em;
  }
  .mask {
    position: absolute;
    top: 200px;
    width: 100%;
    height: 60%;
    background: rgba(0, 0, 0, 0.6);
    z-index: 1;
  }
  .header {
    position: relative;
    .nums {
      position: absolute;
      margin: 0;
      padding: 0;
      top: 3px;
      right: 0px;
      background: #2cb98e;
      color: #fff;
      border-radius: 50%;
      padding: 0 5px;
      height: 1.5em;
      line-height: 1.5em;
      font-size: 9px;
    }
    .range {
      padding: 5px 20px;
    }
    .list {
      text-align: left;
      margin-top: 5px;
      li {
        display: inline-block;
        background: #f0f0f0;
        width: 26%;
        font-size: 12px;
        text-align: center;
        line-height: 2em;
        height: 2em;
        border: 1px solid #ccc;
        margin-right: 1em;
        margin-bottom: 5px;
        color: #000;
        cursor: pointer;
        position: relative;
        i{
          display: block;
          position: absolute;
          top: -0.5em;
          right: 0;
          font-size: 9px;
          color:#2dbaba;
          border-radius: 50%;
        }
      }
      .li2 {
        width: auto;
        min-width: 5.5em;
        padding: 0 2px;
      }
      .sel {
        background: #2cb98e;
        color: #fff;
        border-color: #2cb98e;
        i{
          color: #fff;
        }
      }
    }
    .ghs {
      width: 100%;
      li {
        width: 16% !important;
        background: #fff;
        color: #2dbaba;
        border: none;
        font-size: 14px;
        border-bottom: 1px solid #f0f0f0;
        margin-right: 0;
        line-height: 1.5em;
        height: 1.5em;
      }
    }
    .order {
      position: absolute;
      top: 10px;
      right: 10px;
      font-size: 14px;
      li {
        display: block;
        line-height: 2em;
        border-bottom: 1px solid #f0f0f0;
      }
      .sel {
        color: #2dbaba;
      }
    }
    .content {
      overflow: hidden;
      > div {
      }
      .list-wrap {
        min-height: 180px;
        max-height: 300px;
        overflow-y: scroll;
        padding: 0 10px 50px 10px;
        background: rgb(240, 240, 240);
      }
      .entList {
        min-height: 10em;
        overflow: scroll;
        margin-bottom: 2em;
        li {
          text-align: left;
          padding-left: 10px;
          height: 2em;
        }
        .sel {
          color: #2cb98e;
        }
      }
      position: absolute;
      top: 70px;
      width: 100%;
      background: #fff;
      z-index: 9;
      .btns {
        position: absolute;
        bottom: 0;
        width: 100%;
        padding: 10px 0;
        height: 2.5em;
        background: #fff;
        z-index: 999;
        overflow: hidden;
        text-align: center;
        border-top: 1px solid #f2f2f2;
        > div {
          width: 80%;
          background: #2cb98e;
          color: #fff;
          font-size: 14px;
          height: 2em;
          line-height: 2em;
          margin-left: 10px;
          display: inline-block;
        }
      }
      h5 {
        text-align: left;
        margin-top: 1em;
        i {
          font-style: normal;
          color: #2cb98e;
          font-weight: bold;
          margin-left: 5px;
        }
      }
    }
    i {
    }
    .active {
      color: #2cb98e;
    }
    > ul {
      background: #fff;
      border-bottom: 3px solid #ccc;
      display: flex;
      li {
        display: inline-block;
        padding: 0 0;
        min-width: 15%;
        flex: 1;
        height: 2em;
        line-height: 2em;
        font-size: 14px;
        border-bottom: 1px solid #fff;
        position: relative;
        text-align: center;

        b {
          // width: 1px;
          // background: #f0f0f0;
          // height: 2.5em;
          // display: block;
          // position: absolute;
          // right: 0;
          // top: 0.5em;
        }
      }
      // li:last-child {
      //   b {
      //     display: none;
      //   }
      // }
      .border {
        border-color: #f0f0f0;
      }
    }
  }
}
</style>